<template>
    <a-form ref="form" :model="jl"
            :label-col-props="{span:0,offset:0}"
            :wrapper-col-props="{span:100,offset:0}"
            @submit="addOrEditJoblevel"
    >
        <a-row :gutter="8">
            <a-col :span="4">
                <a-form-item field="name"
                             :rules="[{required:true,message:'职称名称必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input size="large" v-model="jl.name" placeholder="职称名称"></a-input>
                </a-form-item>
            </a-col>
            <a-col :span="4">
                <a-form-item field="titleLevel"
                             :rules="[{required:true,message:'职称等级必选'}]"
                >
                    <a-select size="large" v-model="jl.titleLevel">
                        <a-option value="正高级">正高级</a-option>
                        <a-option value="副高级">副高级</a-option>
                        <a-option value="中级">中级</a-option>
                        <a-option value="初级">初级</a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="2" v-if="type==='add'">
                <a-button size="large" type="primary" html-type="submit">添加</a-button>
            </a-col>
        </a-row>
        <a-row v-if="type==='edit'">
            <a-col>&nbsp;</a-col>
        </a-row>
        <a-row v-if="type==='edit'">
            <a-col :span="18">&nbsp;</a-col>
            <a-col :span="3">
                <a-button size="large" @click="$emit('cancel')">取消</a-button>
            </a-col>
            <a-col :span="3">
                <a-button size="large" type="primary" html-type="submit">确认</a-button>
            </a-col>
        </a-row>
    </a-form>
</template>

<script>
    export default {
        name: "",
        props: {
            type: {
                type: String,
                required: true,
                default: 'add'
            },
            jobLevel: {
                type: Object,
                required: false,
                default: {
                    name: '',
                    titleLevel: '初级'
                }
            }
        },
        emits: ['success', 'cancel'],
        data() {
            return {
                jl: this.$DeepCopy(this.jobLevel)
            }
        },
        methods: {
            addOrEditJoblevel({values, errors}) {
                if (!errors) {
                    let fun = this.$post
                    let url = this.requestUrl.addJoblevel.url
                    if (this.type === 'edit') {
                        fun = this.$put
                        url = this.requestUrl.editJoblevel.url
                        this.jl.createDate = ''
                    }
                    fun(url, this.jl).then(res => {
                        this.$message.success(res.message)
                        this.$emit('success')
                    })
                }
            },
        },
        watch: {
            'jobLevel'() {
                this.jl = this.$DeepCopy(this.jobLevel)
            }
        },
        updated() {
        },
    }
</script>

<style scoped>

</style>
